<script setup lang="ts">
	
// import { ref } from "vue";
import { RouterView } from "vue-router";
// import ScaleScreen from "../components/scale-screen";
import Headers from "./HeaderHome.vue";
import { FullScreenContainer } from '@kjgl77/datav-vue3'

// const wrapperStyle = {};

</script>

<template>
  <!--  <scale-screen-->
  <!--    width="1920"-->
  <!--    height="1080"-->
  <!--    :delay="500"-->
  <!--    :fullScreen="false"-->
  <!--    :boxStyle="{-->
  <!--      background: '#03050C',-->
  <!--      overflow: 'hidden',-->
  <!--    }"-->
  <!--    :wrapperStyle="wrapperStyle"-->
  <!--  >-->
  <!--    <div class="content_wrap">-->
  <!--      <Headers />	  -->
  <!--      <RouterView />-->

  <!--    </div>-->
  <!--  </scale-screen>-->

  <full-screen-container>
    <div class="content_wrap">
      <Headers class="home_title"/>
      <RouterView class="home_main"/>

    </div>
  </full-screen-container>
</template>
<style scoped>
:root {
  --home-title-height: 100px;
}
.content_wrap {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  /*   background-image: url("@/assets/img/images/bg.jpg");   background-color: #0e618c; */
  background-size: cover;
  background-position: center center;
  display: flex;
  flex-direction: column;
  background-color: #2e2b2b; /* 整体的背景，也可以说是间隙的背景 */
  background-image: url("../assets/img/bg/home-bg.png");
}
.home_title{
  width: 100%;
  height: 100px;
}
.home_main{
  width: 100%;

  height: calc(100% - 100px);
  padding-bottom: 10px;
}

</style>
